<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>YAOP Dashboard</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="robots" content="all,follow">
    <link rel="stylesheet" href="/static/vendor/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="/static/vendor/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="/static/vendor/css/style.default.css" id="theme-stylesheet">

</head>
<body>
<div class="page login-page">
    <div class="container">
        <div class="form-outer text-center d-flex align-items-center">
            <div class="form-inner">
                <div class="logo text-uppercase"><span>Bootstrap</span><strong class="text-primary">Dashboard</strong>
                    <img src="{{.Url}}">
                </div>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
                    et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud.</p>
                <form method="get" class="text-left form-validate">
                    <div class="form-group-material">
                        <input id="login-username" type="text" name="YaopLoginUsername" required
                               data-msg="Please enter your username" class="input-material">
                        <label for="login-username" class="label-material">Username</label>
                    </div>
                    <div class="form-group-material">
                        <input id="login-password" type="password" name="YaopLoginPassword" required
                               data-msg="Please enter your password" class="input-material">
                        <label for="login-password" class="label-material">Password</label>
                    </div>
                    <div class="form-group-material">
                        <input id="login-two-password" type="password" name="YaopLoginTwoPassword" required
                               data-msg="Please enter your two password" class="input-material">
                        <label for="login-two-password" class="label-material">Two Password</label>
                    </div>
                    <div class="form-group text-center">
                        <a id="login" onclick="login()" class="btn btn-primary">Login</a>
                        <!-- This should be submit button but I replaced it with <a> for demo purposes-->
                    </div>
                </form>
                <a href="#" class="forgot-pass">Forgot Password?</a><small>Do not have an account? </small><a
                        href="register.html" class="signup">Signup</a>
            </div>
        </div>
    </div>
</div>
<script src="/static/vendor/jquery/jquery.min.js"></script>
<script src="/static/vendor/bootstrap/js/bootstrap.min.js"></script>
<script src="/static/vendor/jquery-validation/jquery.validate.min.js"></script>
<script src="/static/vendor/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.concat.min.js"></script>
<!-- Main File-->
<script src="/static/vendor/js/front.js"></script>
<script>
    function login() {
        let name = $("#login-username").val();
        let pwd = $("#login-password").val();
        let tpwd = $("#login-two-password").val();
        $.ajax({
            url: "/manager/user/in",
            type: "POST",
            dataType: "json",
            data: JSON.stringify({name, pwd, tpwd}),
            complete: function (e) {
                if (e.status === 200) {
                    location.href = "/manager/page/index";
                }
            }
        });
    }

    document.onkeypress = function (e) {
        if (e.key === "Enter") {
            login();
        }
    }
    $.ajax({
        url: "/auth/qr/connect?code={{.Code}}",
        complete: function (e) {
            if (e.status === 200) {
                location.href = "/manager/page/index";
            }else{
                alert("验证失败！！")
            }
        }
    })
</script>
</body>
</html>